<template>
  <div>
    <div class="list-btn">
      时间:<DatePicker type="date" @on-change="startTime"  placeholder="选择开始时间" style="width: 200px" ></DatePicker>
      ～<DatePicker type="date" @on-change="endTime"  placeholder="选择结束时间" style="width: 200px"  ></DatePicker>
    </div>
     <div class="list-btn">
      渠道:
      <Select clearable style="width:200px" v-model="params.channelCode" placeholder="全部" >
        <Option value=" ">全部</Option>
        <Option v-for="(item,index) in channelCodeList" :value="item.channelCode" :key="index">{{ item.channelName }}</Option>
      </Select>
    </div>
    <div class="list-btn">
      <Button type="primary" @click="getList(url,'refresh');get(params.channelCode);">搜索</Button>
    </div>
    <page-list :listTitle="listTitle" :list="list" :loading="loading" @selectItem="ids = $event;"></page-list>
    <page-button :total="total" @changePageNum="params.pageCurrent = $event; getList(url)" @changePageSize="params.pageLimit = $event; getList(url)"></page-button>
  </div>
</template>

<script>
  import listMixin from '../../mixin/list'
  import pageList from '../../template/listTemplate'
  import pageButton from '../../template/pageBtnTemplate'
  import confirmDialog from '../../template/confirmDialogTemplate'
  export default {
    mixins:[listMixin],
    components: {
      pageList,
      pageButton,
      confirmDialog
    },
    mounted() {
      this.getChannel();
    },
    methods:{
      get(s){
        console.log(s,'sss');
        if(s){
        this.$post('/bkchannel/list',{channelCode:s})
        .then((res) => {
          if(res.code === 0){
            this.channelName = res.data.pageListData[0].channelName;
          }else{
            // this.$Message.error(res.msg);
          }
        }, (err) => {
          // this.loading = false;
          console.log(err);
        })
        }else{
          this.channelName = ""
        }

      }
    },
    data () {
      return {
        tag: {
          'title': '订单通过率',
          'path': '/work/passRate/list'
        },
        channelName:'',
        listTitle: [
          {
            title: '日期',
            key: 'date',
            minWidth: 80,
            align:'center',
            render: (h,params) =>{
              return h('div',this.getLocalDate(params.row.date))
            }
          },
          {
            title: '渠道',
            key: 'channelName',
            minWidth: 80,
            align:'center',
           render:(h,params) => {
            return h('div', this.channelName ? this.channelName : "全部")
          }
          },
         {
            title: '总申请数',
            key: 'orderApplyCount',
            align:'center' ,
            minWidth: 80
          },
          {
            title: '总审核通过数(率)',
            key: 'orderAuditThoughCount',
            align:'center',
            minWidth: 110,
            render: (h,params) =>{
              return h('div',`${params.row.orderAuditThoughCount} (${(params.row.orderAuditThoughRate*100).toFixed(2)}%)`)
            }

          },
         {
            title: '总放款数(率)',
            key: 'orderLoanCount',
            align:'center' ,
            minWidth: 80,
            render: (h,params) =>{
              return h('div',`${params.row.orderLoanCount} (${(params.row.orderLoanRate*100).toFixed(2)}%)`)
            }

          },

        /*  {
            title: '总放款金额(元)',
            key: 'orderLoanAmount',
            align:'center',
            minWidth: 80,
            render: (h,params) =>{
              return h('div',this.toYuan(params.row.orderLoanAmount))
            }

          },*/
          {
            title: '新户申请数',
            key: 'newUserOrderApplyCount',
            align:'center',
            minWidth: 60
          },
          {
            title: '新户审核通过数(率)',
            key: 'newUserOrderAuditThoughCount',
            align:'center',
            minWidth: 70,
            render: (h,params) =>{
              return h('div',`${params.row.newUserOrderAuditThoughCount} (${(params.row.newUserOrderAuditThoughRate*100).toFixed(2)}%)`)
            }
          },
          {
            title: '新户放款数(率)',
            key: 'newUserOrderLoanCount',
            align:'center',
            minWidth: 110,
             render: (h,params) =>{
              return h('div',`${params.row.newUserOrderLoanCount} (${(params.row.newUserOrderLoanRate*100).toFixed(2)}%)`)
            }
          },

       /*   {
            title: '新户放款金额(元)',
            key: 'newUserOrderLoanAmount',
            align:'center',
            minWidth: 60,
            render: (h,params) =>{
              return h('div',this.toYuan(params.row.newUserOrderLoanAmount))
            }
          },*/
/*
          {
            title: '次新户申请数',
            key: 'minorNewUserOrderApplyCount',
            align:'center',
            minWidth: 60
          },
          {
            title: '次新户审核通过数',
            key: 'minorNewUserOrderAuditThoughCount',
            align:'center',
            minWidth: 60
          },
          {
            title: '次新户审核通过率',
            key: 'minorNewUserOrderAuditThoughRate',
            align:'center',
            minWidth: 70,
            render: (h,params) =>{
              return h('div',(params.row.minorNewUserOrderAuditThoughRate*100).toFixed(2)+"%")
            }
          },

          {
            title: '次新户放款数',
            key: 'minorNewUserOrderLoanCount',
            align:'center',
            minWidth: 60
          },
          {
            title: '次新户放款率',
            key: 'minorNewUserOrderLoanRate',
            align:'center',
            minWidth: 60,
            render: (h,params) =>{
              return h('div',(params.row.minorNewUserOrderLoanRate*100).toFixed(2)+"%")
            }
          },

          {
            title: '次新户放款金额(元)',
            key: 'minorNewUserOrderLoanAmount',
            align:'center',
            minWidth: 60,
            render: (h,params) =>{
              return h('div',this.toYuan(params.row.minorNewUserOrderLoanAmount))
            }

          },*/
          {
            title: '老户申请数',
            key: 'oldUserOrderApplyCount',
            align:'center',
            minWidth: 60
          },
          {
            title: '老户审核通过数(率)',
            key: 'oldUserOrderAuditThoughCount',
            align:'center',
            minWidth: 110,
             render: (h,params) =>{
              return h('div',`${params.row.oldUserOrderAuditThoughCount} (${(params.row.oldUserOrderAuditThoughRate*100).toFixed(2)}%)`)
            }
          },
          {
            title: '老户放款数(率)',
            key: 'oldUserOrderLoanCount',
            align:'center',
            minWidth: 110,
             render: (h,params) =>{
              return h('div',`${params.row.oldUserOrderLoanCount} (${(params.row.oldUserOrderLoanRate*100).toFixed(2)}%)`)
            }
          },
        /*  {
            title: '老户放款金额(元)',
            key: 'oldUserOrderLoanAmount',
            align:'center',
            minWidth: 80,
            render: (h,params) =>{
              return h('div',this.toYuan(params.row.oldUserOrderLoanAmount))
            }

          },*/

        ],
        url: '/statistics/customer/throughRate',
        nameListUrl: '',
        params: {
          //status:'',
          pageCurrent: 1,
          pageLimit: 10
        },

      }
    },
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .list-btn{
    margin-bottom: 5px;
    margin-right: 5px;
    display: inline-block;
  }
  .refresh-btn{
    float: right;
  }

  /deep/ .ivu-table-cell{
    padding-left: 5px;
    padding-right: 5px;
  }
</style>
